<template>
	<i-popup v-if="modelValue" :body="false">
		<view class="picc_bg">
			<view class="title">
				<text>恭喜您获得</text>
				<view><text class="points">{{piccPointsInfo.amount}}</text><text> 积分</text></view>
			</view>
			<i-buttons @click="confirm" color="#FFFFFF" bgColor="#FB652E" size="32rpx" border="#FB652E"
						radius="44" padding="22rpx 132rpx">立即领取</i-buttons>
			<view class="descr">
				可在“我的-积分商城”内查看
			</view>
		</view>
	</i-popup>
</template>

<script lang="ts" setup>
	import {
		defineProps,
		defineEmits
	} from 'vue'
	import { navTo } from '../../utils/common'
	defineProps({
		modelValue: {
			type: Boolean,
			default: false
		},
		piccPointsInfo: {
			type: Object,
			default: {}
		},

	})
	const emit = defineEmits([
		'confirm',
		'update:modelValue'
	])

	const close = () => {
		emit('update:modelValue', false)
	}

	const confirm = () => {
		emit('confirm')
		emit('update:modelValue', false)
	}
</script>

<style lang="scss" scoped>
	.picc_bg {
		width: calc(100% - 152rpx);
		height: 584rpx;
		margin: 0 auto;
		@include flexCC;
		
		background-color: #FFFFFF;
		border-radius: 48rpx;

		.title{
			font-weight: 500;
			font-size: 40rpx;
			color: rgba(0,0,0,0.85);
			line-height: 120rpx;
			text-align: center;
			margin-bottom: 40rpx;
			.points{
				font-size: 92rpx;
				font-weight: bold;
			}
		}
		
		.descr{
			margin-top: 20rpx;
			font-weight: 400;
			font-size: 24rpx;
			color: rgba(0,0,0,0.3);
			text-align: center;
		}
	}
</style>